<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <title>货车信息列表</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="${pageContext.request.contextPath}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/animate.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/style.min.css?v=4.1.0" rel="stylesheet">
    <style type="text/css">
    	#allmap{height:500px;width:100%;}
    </style>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <!-- Panel Other -->
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>货车管理</h5>
        </div>
        <div class="ibox-content">
            <div class="row row-lg">
                <div class="col-sm-12">
                    <div class="example-wrap">
                        <!-- start toolbar -->
                        <div class="col-sm-10">
                            <form class="form-horizontal" role="form" id="querytruckForm" autocomplete="off">
                                <div class="row">
                                 	<div class="col-sm-4">
                                        <div class="form-group">
                                            <label class="col-sm-4 control-label">车牌号</label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control" placeholder="车牌号" id="truckCarNum" name="truckCarNum">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-sm-4">
                                        <div class="form-group">
                                            <label class="col-sm-4 control-label">司机姓名</label>
                                            <div class="col-sm-8">
                                                <input type="text" class="form-control" placeholder="司机姓名" id="driverName" name="driverName">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-sm-4">
                                    	<button type="button" class="btn btn-primary" id="querytruckBtn">
                                            <span class="glyphicon glyphicon-search" aria-hidden="true"></span> 查询
                                        </button>
                                        <shiro:hasPermission name="truck:edit">
                                        	<button class="btn btn-info" id="addBut" type="button">新增货车</button>
                                        </shiro:hasPermission>
                                        <button type="button" class="btn btn-primary" id="positionBtn">查看车辆位置</button>
                                        <button type="button" class="btn btn-info" id="" onclick="location.reload();">
                                            <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span> 刷新
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <!-- end toolbar -->
                        <div class="example">
                            <table id="truckTab" class="table" data-click-to-select="true" data-mobile-responsive="true">
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Panel Other -->
<script src="${pageContext.request.contextPath}/js/jquery.min.js?v=2.1.4"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${pageContext.request.contextPath}/js/content.min.js?v=1.0.0"></script>
<script src="${pageContext.request.contextPath}/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="${pageContext.request.contextPath}/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="${pageContext.request.contextPath}/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="${pageContext.request.contextPath}/js/plugins/layer/layer.min.js"></script>
<script src="${pageContext.request.contextPath}/js/public/ttbj-core.js"></script>
<script type="text/javascript">
var $table = $("#truckTab");
$(function () {
	//初始化表格
    initTable();
    //条件查询
    $("#querytruckBtn").click(function () {
        $table.bootstrapTable('refresh');
    });
    
    //增加货车按钮
    $("#addBut").click(function () {
    	initTruckEdit(null);
    });
    
  	//查看货车位置按钮
    $("#positionBtn").click(function () {
    	var selectContent = $table.bootstrapTable('getSelections');
    	var ids = new Array();
    	for(var i=0;i<selectContent.length;i++){
    		ids[i] = selectContent[i].truckId;
    	}
    	//如果数组为空，则页面提示
    	if(ids.length == 0){
    		layer.msg('请选择一辆或多辆货车!');
            return false;
    	}
    	truckPosition(ids);
    });
});

function initTable() {
    $table.bootstrapTable({
        dataType: "json",
        pagination: true, //分页
        striped: true,
        cache: false,	//是否使用缓存，默认是true
        pageSize: 10,
        pageNumber: 1,
        queryParamsType: 'limit',
        smartDisplay: true,
        sidePagination: "server",
        method: "post",	//使用post提交
        queryParams: queryParams,
        url: '../truck/getTruckInfoByPage.htm',
        contentType: 'application/x-www-form-urlencoded;charset=UTF-8',
        columns: [
        	{
        		checkbox: true
        	},
			{
				title: "序号",
			    align: 'center',
			    formatter:function(value,row,index){
			    	return index + 1;
			    }
			},
            {
                title: "货车编号",
                field: "truckNum",
                align: 'center',
                valign: 'middle'
            },
            {
                title: "车牌号",
                field: "truckCarnum",
                align: 'center',
                valign: 'middle'

            },
            {
                title: "车辆类型",
                field: "truckType",
                align: 'center',
                formatter: function(value, row, index){
                    var truckType = "";
                    if(row.truckType == 1){
                        truckType = '重型货车';
                    }else if(row.truckType == 2){
                        truckType ='中型货车';
                    }else if(row.truckType == 3){
                        truckType ='轻型货车';
                    }else if(row.truckType == 4){
                        truckType ='微型货车';
                    }
                    return truckType;
                }
            },
            {
                title: "司机姓名",
                field: "driverRealName",
                align: 'center',
                valign: 'middle'
            },
            {
            	title: "分站点名",
            	field: "comnumName",
            	align: 'center',
            	valign: 'middle'
            },
            {
                title: "插入时间",
                field: "truckInsTime",
                align: 'center',
                valign: 'middle'
            },
            {
            	title: "是否删除(禁用)",
                field: "truckIsDelete",
                align: 'center',
                formatter: function(value, row, index){
            		var desc = '';
            		if(row.truckIsDelete == 0){
            			desc = '<span style="color:#436EEE;">已禁用</span>';
            		}else if(row.truckIsDelete == 1){
            			desc = '<span style="color:#00CD00;">未禁用</span>';
            		}
            		return desc;
            	}
            },
            {
                title: "操作",
                align: 'center',
                formatter: function (value, row, index) {
                    var e = '<shiro:hasPermission name="truck:edit"><button class="btn btn-xs btn-info" type="button" onclick="initTruckEdit(\'' + row.truckId + '\')"><i class="fa fa-edit"></i> 编辑</button></shiro:hasPermission>';
                    var d = '';
                    if (row.truckIsDelete == 1){
                        d = '<button class="btn btn-xs btn-danger" type="button" onclick="modifyTruckDisable(\'' + row.truckId + '\',\'' + row.truckCarnum + '\',\'' + 0 + '\')"><i class="fa fa-trash-o"></i> 禁用 </button> ';
                    }else if(row.truckIsDelete == 0){
                        d = '<button class="btn btn-xs btn-warning" type="button" onclick="modifyTruckDisable(\'' + row.truckId + '\',\'' + row.truckCarnum + '\',\'' + 1 + '\')"><i class="fa fa-trash-o"></i> 启用 </button> ';
                    }
                    return e + d;
                }
            }
        ]
    });
}

//分页参数，条件查询时的参数
function queryParams(queryParamsType){
	var temp = {
		limit: queryParamsType.limit,   //页面大小
		offset: queryParamsType.offset,  //页码
		truckCarNum: $.trim($('#truckCarNum').val()),
		driverName: $.trim($('#driverName').val())
	};
	return temp;
}

//禁用和启用货车
function modifyTruckDisable(companyId, truckCarnum, isDelete) {
    layer.confirm('你确定要修改【' + truckCarnum + '】货车状态吗？', {
        btn: ['修改', '取消'] //按钮
    }, function () {
        $.ajax({
            url: "../truck/modifyTruckIsDel.htm",
            cache: false,
            type: "get",
            dataType: "json",
            data: {'truckId': companyId,'isDel':isDelete},
            success: function (result) {
                if (result.status == 0) {
                    layer.msg(result.message, {icon: 1});
                    $table.bootstrapTable('refresh', {url: '../truck/getTruckInfoByPage.htm'});
                    return;
                }
                layer.msg(result.message, {icon: 2});
            }
        });
    }, function () {});
}

//增加和编辑货车页面
function initTruckEdit(id){
    var title;
    if(id){
        title = '编辑货车';
    }else{
        title = '新增货车';
    }
    layer.open({
        type: 2,
        title: title,
        maxmin: false,
        shadeClose: false, //点击遮罩关闭层
        area : ['500px' , '650px'],
        content: '../truck/edit_truck.htm?id='+id,
        success: function(layero, index){
        }
    });
}

//增加和编辑货车页面
function truckPosition(ids){
    layer.open({
        type: 2,
        title: '车辆位置',
        maxmin: false,
        shadeClose: false, //点击遮罩关闭层
        area : ['90%' , '90%'],
        content: '../truck/truck_position.htm?ids=' + ids,
        success: function(layero, index){
        }
    });
}
</script>
</body>
</html>
